<template>
  <div class="page-container">
    <page_breadcrumb :getKeyMethod="init_table_model" @change="change_table_model" pageOption />
    <ex_super_table_page v-bind="option" ref="SuperTablePage" @selection-change="e => selection = e" :autoPage="false"
      @search="searchChange">
    </ex_super_table_page>
    <!-- <ex_super_dialog_form ref="detailDialog" v-bind="detailDialog" :noSubmit="true">
    </ex_super_dialog_form> -->

    <el-dialog :title="detailDialogTitle" :visible.sync="detailDialogVisible" customClass='dialog_extra'>
      <ex_header_spiler :title="$t('label_sku_specification')" />
      <ex_super_table ref="dialogTable" height="500" autoPage
        url="/wms-api/refund/WmsReturnQueryRpc/queryItemDetails.json" :urlParams="detailDialogParams"
        :model="detailDialogModel" />
      <div slot="footer" class="dialog-footer">
        <el-button @click="detailDialogVisible = false">{{ $t('label_cancel') }}</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import superTablePageFunction from '@/mixin/super-table-page-function';
import emitOnFunction from '@/mixin/emit-on-function';

import page_table_model_manage from '@/mixin/page_table_model_manage';

let emitKey = 'returngood>temp_list'
export default {
  title: 'label_return_good_temp_save_search',
  mixins: [superTablePageFunction, emitOnFunction(emitKey), page_table_model_manage],
  components: {},
  data() {
    return {
      selection: [],
      createTimeFrom: null,
      createTimeTo: null,
      orderData: {
        waitingNum: null,
        processingNum: null,
        needDeleteNum: null,
      },
      status_map: {
        "NEED_INSPECT": 'needInspectNum',
        'NEED_PUTAWAY': 'needPutawayNum',
        "NEED_DESTROY": 'needDestroyNum',
        "HAS_DESTROY": 'hasDestroyNum',
        "NEED_CONFIRM": 'needConfirmNum',
      },
      option: {
        search: {
          default: { queryType: "ALL" },
          resetFieldFun: (def, org) => { def.queryType = org.queryType; return def },
          model: [
            {
              key: 'queryType', label: 'label_status', itemClass: "w_fill",
              render: (h, { data }) => {
                const list = [
                  { label: 'ReturnOrderStatusEnum__WAIT_INSPECT', code: 'NEED_INSPECT' },
                  { label: 'ReturnOrderStatusEnum__WAIT_PUTAWAY', code: 'NEED_PUTAWAY' },
                  { label: 'ReturnOrderStatusEnum__WAIT_DESTROY', code: 'NEED_DESTROY' },
                  { label: 'ReturnOrderStatusEnum__DESTROYED', code: 'HAS_DESTROY' },
                  { label: 'label_wait_ing', code: 'NEED_CONFIRM' }
                ]
                .map(it => (
                  <el-radio-button key={it.code} label={it.code}>
                    {this.$tt(it.label)}
                    {this.status_map[it.code] && this.orderData[this.status_map[it.code]] ? `(${this.orderData[this.status_map[it.code]]})` : "(0)"}
                  </el-radio-button>
                ))
                return (<el-radio-group value={data.queryType}
                  onInput={e => {
                    this.$set(data, 'queryType', e)
                    this.$refs.SuperTablePage.loadDataForSearch()
                  }}>
                  <el-radio-button key="ALL" label="ALL">
                    {this.$tt("label_all")}
                  </el-radio-button>
                  {list}
                </el-radio-group>
                )
              }
            },
            { key: 'containerCode', label: 'label_container_code', },
            { key: 'trackingNumber', label: 'label_track_code', },
            { label: "label_customer", key: "customerId", type: 'common_customer_choose' },
            { key: 'skuReturnCode', label: 'label_return_order_sku_code', },
            // { key: 'queryType', label: 'label_status', type: 'select', enum: 'ReturnOrderStatusEnum' },
          ],
        },
        table: {
          url: "/wms-api/refund/WmsReturnQueryRpc/queryContainer.json",
          model: this.init_table_model(),
        },
      },
      detailDialogModel: [
        { key: 'returnOrderCode', label: 'label_return_order_code', 'min-width': 140, },
        { key: 'skuBarcode', label: 'label_sku_code', 'min-width': 140, },
        { key: 'skuOnlyCode', label: 'label_sku_only_code', 'min-width': 140, },
        { key: 'returnSkuCodeList', label: 'label_return_order_sku_code', 'min-width': 140,formatter: (r, c, v) => v?v.join(','):'' },
        { key: 'trackingNumber', label: 'label_track_code', 'min-width': 140, },
        { key: 'customerTrackingNumber', label: 'label_customer_track_code', 'min-width': 140, },
        {
          key: 'skuName', label: 'label_sku_name', 'width': 140,
          render: (h, { row }) => (<div>
            <div>{row.skuName}</div>
            <div>{row.skuNameEn}</div>
            <div>{row.skuNameRu}</div>
          </div>)
        },
        { key: 'isAbnormal', label: 'label_is_abnormal', 'width': 120, formatter: (r, c, v, i) => this.$enumShow(v, "YesOrNoEnum") },
        {
          key: 'returnHandlingMethod', label: 'label_do_with_method', 'width': 140, 'show-overflow-tooltip': true,
          formatter: (r, c, v, i) => this.$enumShow(v, "SkuReturnMethodEnum")
        },
        { key: 'skuReturnQuantity', label: 'label_return_order_count', 'width': 130, 'show-overflow-tooltip': true, },

      ],
      detailDialogTitle: "",
      detailDialogVisible: false,
      detailDialogParams: {},

    };
  },
  methods: {
    searchChange() {
      this.$ajax({
        url: "/wms-api/refund/WmsReturnQueryRpc/queryStatis.json",
        method: 'post',
        // data: this.$refs.SuperTablePage.getSearchFormData(),
        success: (res) => {
          this.orderData = res.data
        }
      })
    },
    option_table_model() {
      return [
        { type: 'selection', clickToggle: true, keyGroup: 'label_table_operate' },
        {
          type: 'expandDesc', 'width': 100,
          expandDesc: {
            ...this.$defaultDescAttrs,
            model: [],
          },
        },
        { key: 'containerCode', label: 'label_container_code', 'min-width': 200, 'show-overflow-tooltip': true, },
        { key: 'containerTypeCode', label: 'label_container_type_code', 'min-width': 200, 'show-overflow-tooltip': true, },
        { key: 'containerTypeName', label: 'label_container_type_name', 'min-width': 200, 'show-overflow-tooltip': true, },
        { key: 'orderNums', label: 'label_order_count', 'min-width': 120, 'show-overflow-tooltip': true, },

        { key: 'needInspectQty', label: 'label_wait_inspect_sku_count', 'min-width': 130, 'show-overflow-tooltip': true, },
        { key: 'needPutawayQty', label: 'label_wait_putaway_sku_count', 'min-width': 130, 'show-overflow-tooltip': true, },
        { key: 'needDestroyQty', label: 'label_need_delete_qty', 'min-width': 130, 'show-overflow-tooltip': true, },
        { key: 'hasDestroyQty', label: 'label_has_delete_sku_count', 'min-width': 130, 'show-overflow-tooltip': true, },
        { key: 'needConfirmQty', label: 'label_waiting_sku_count', 'min-width': 130, 'show-overflow-tooltip': true, },
        { key: 'noMethodQty', label: 'label_no_handle_sku_count', 'min-width': 130, 'show-overflow-tooltip': true, },
        { key: 'totalQty', label: 'label_sku_count_sum', 'min-width': 130, 'show-overflow-tooltip': true, },

        {
          type: 'operate', width: 160, fixed: 'right', operate: [
            {
              label: 'label_view_detail', click: (row) => {
                this.detailDialogTitle = this.$formatNameCode(this.$tt("label_container_sku_list"), row.containerCode)
                this.detailDialogVisible = true
                this.detailDialogParams = {
                  containerCode: row.containerCode
                }
                this.$nextTick(() => {
                  this.$refs.dialogTable.loadData({})
                })
                // this.$refs.detailDialog.showNew({
                //   title: this.$formatNameCode(this.$tt("label_container_sku_list"), row.containerCode),
                //   data: { rows: [], containerCode: row.containerCode },
                //   onlySetData: true,
                // })
                // this.$refs.unclaimedDialog.show({ row, emitKey })
              }
            },
            {
              label: 'label_release_container',
              if: (row) => row.hasDestroyQty == row.totalQty && row.hasDestroyQty > 0 && this.$refs.SuperTablePage.getSearchData().queryType == 'HAS_DESTROY',
              type: "confirm-button", buttonClass: "button_text_danger", confirmButtonType: 'danger',
              url: "/wms-api/refund/WmsReturnContainerRpc/release_container.json", message: 'text_confirm_sure_cancel',
              params: (v) => { return { containerCode: v.containerCode } }, done: ['reload', 'tip']
            },
          ]
        }
      ]
    },

  }
};

</script>
